import React from "react";
class opacity extends React.Component {
  // 声明函数
  constructor(props) {
    // props 继承
    super(props);
    // 变量声明
    this.state = {
      opacity: 1.0,
    };
  }
  // 生命周期
  componentDidMount() {
    this.timer = setInterval(
      function () {
        var { opacity } = this.state;
        opacity -= 0.2;
        if (opacity < 0.1) {
          opacity = 1.0;
        }
        this.setState({
          opacity,
        });
      }.bind(this),
      500
    );
  }
  componentWillUnmount() {
    clearInterval(this.timer);
  }
  // 渲染函数
  render() {
    return (
      <div>
        <div style={{ opacity: this.state.opacity }}>opacity动画</div>
      </div>
    );
  }
}

export default opacity;
